<template>
  <div class="reviseInformation">
    <h2>修改基本信息</h2>
    <div class="main mt-40">
      <a-form-model
        ref="ruleForm"
        :model="form"
        :rules="rules"
        :label-col="labelCol"
        :wrapper-col="wrapperCol"
      >
        <a-form-model-item
          ref="name"
          label="企业logo"
          prop="name"
          class="clearfix"
        >
          <div class="img-box mr-20 f-left">
            <img v-if="form.logo" :src="form.logo" alt="" />
          </div>
          <div class="uploadlogo f-left">
            <a-upload
              :action="UploadUrl"
              :headers="headers"
              :before-upload="beforeUpload"
              @change="(info) => handleChange(info, 0)"
              :show-upload-list="false"
            >
              <!-- v-if="this.EntInfo.auditStatus != 1" -->
              <a-button type="primary"> 上传附件</a-button>
            </a-upload>
          </div>
        </a-form-model-item>
        <a-form-model-item
          ref="name"
          label="营业执照"
          prop="businessLicense"
          class="clearfix"
        >
          <div class="img-box mr-20 f-left">
            <img
              v-if="form.businessLicense"
              :src="form.businessLicense"
              alt=""
            />
          </div>
          <div class="uploadlogo f-left">
            <a-upload
              :action="UploadUrl"
              :headers="headers"
              :before-upload="beforeUpload"
              @change="(info) => handleChange(info, 1)"
              :show-upload-list="false"
            >
              <!-- v-if="this.EntInfo.auditStatus != 1" -->
              <a-button type="primary"> 上传附件</a-button>
            </a-upload>
          </div>
        </a-form-model-item>
        <a-form-model-item label="行业类别" prop="industry">
          <!-- <a-input v-model="form.categories" placeholder="请输入传统行业类别" /> -->
          <a-select v-model="form.industry" placeholder="请选择行业类别">
            <a-select-option
              v-for="item in traditionalCategory"
              :key="item.dictValue"
              :value="item.dictValue"
              >{{ item.dictLabel }}</a-select-option
            >
          </a-select>
        </a-form-model-item>

        <!-- nature_business -->
        <a-form-model-item label="经营范围" prop="natureBusiness">
          <a-input
            v-model="form.natureBusiness"
            :maxLength="200"
            type="textarea"
            placeholder="请输入经营范围"
          />
        </a-form-model-item>

        <a-form-model-item label="成立日期" prop="incorporationDate">
          <a-date-picker
            v-model="form.incorporationDate"
            valueFormat="YYYY-MM-DD"
            format="YYYY-MM-DD"
            placeholder="请选择成立日期"
            style="width: 100%"
          />
        </a-form-model-item>

        <a-form-model-item label="注册资金" prop="registeredCapital">
          <a-input
            v-model="form.registeredCapital"
            placeholder="请输入注册资金"
            suffix="万"
          />
        </a-form-model-item>

        <a-form-model-item label="企业地址" prop="address">
          <a-input v-model="form.address" placeholder="请输入企业地址" />
        </a-form-model-item>

        <a-form-model-item label="企业网址" prop="site">
          <a-input v-model="form.site" placeholder="请输入企业网址" />
        </a-form-model-item>

        <a-form-model-item label="联系人" prop="linkMan">
          <a-input v-model="form.linkMan" placeholder="请输入联系人" />
        </a-form-model-item>

        <a-form-model-item label="手机号" prop="linkTel">
          <a-input v-model="form.linkTel" placeholder="请输入手机号" />
        </a-form-model-item>

        <a-form-model-item label="企业简介" prop="companyProfile">
          <a-input
            v-model="form.companyProfile"
            :maxLength="200"
            type="textarea"
            placeholder="请输入企业简介"
          />
        </a-form-model-item>
        <a-form-model-item :wrapper-col="{ span: 14, offset: 4 }">
          <a-button type="primary" :disabled="IsDisable" @click="onSubmit">
            提交
          </a-button>
          <a-button style="margin-left: 10px" @click="resetForm">
            <router-link to="/usercenter/BaseInformation"> 返回 </router-link>
          </a-button>
        </a-form-model-item>
      </a-form-model>
    </div>
  </div>
</template>

<script>
import { updateEntBaseInfo, getEntBaseInfo } from "@/apis/user/EntBaseInfo";
import { getToken, getCookiesUserInfo } from "@/utils/auth"; // get token from cookie
import { getCompaynInfo, editCompanyInfo } from "@/apis/com/company";
import { getDicts } from "@/apis/system";
export default {
  data() {
    // 网址校验
    let checkWebAdderss = (rule, value, callback) => {
      let parent =
        /^((https|http|ftp|rtsp|mms){0,1}(:\/\/){0,1})www\.(([A-Za-z0-9-~]+)\.)+([A-Za-z0-9-~\/])+$/;
      let reg = new RegExp(parent);
      if (value !== "" && !reg.test(value)) {
        callback(new Error("网址格式不正确"));
      } else {
        callback();
      }
    };
    // 手机校验
    let checkPhone = (rule, value, callback) => {
      const parent = /^1[3456789]\d{9}$/;
      const reg = new RegExp(parent);
      if (value !== "" && !reg.test(value)) {
        callback(new Error("手机号码格式不正确"));
      } else {
        callback();
      }
    };
    return {
      IsDisable: false,
      EntId: "",
      EntInfo: {},
      // UploadUrl: GolbUrl._BASE_URL_ + "wenge/microservice-supply-consumer-web/sysFile/upload",
      UploadUrl: GolbUrl.BASIC_UPLOAD_URL,

      // UploadUrl: "http://10.204.124.107:8081/wenge/microservice-supply-consumer-web/sysFile/upload",

      isClear: false,
      headers: {
        Authorization: "Bearer " + getToken(),
      },

      labelCol: { span: 2 },
      wrapperCol: { span: 14 },
      other: "",
      form: {
        id: "",
        logo: "", //企业logo
        address: "",
        site: "", //网址
        linkMan: "", //联系人
        linkTel: "", //手机号
        companyProfile: "", //简介
        industry: null,
        registeredCapital: "",
        incorporationDate: "",
        natureBusiness: "",
        businessLicense: "",
        // registeredCapitalStart:null,
        // registeredCapitalEnd:null
      },
      rules: {
        address: [
          { required: true, message: "请输入企业地址", trigger: "blur" },
        ],
        site: [
          { required: true, message: "请输入网址", trigger: "blur" },
          { validator: checkWebAdderss, trigger: "blur" },
        ],
        linkMan: [
          { required: true, message: "请输入联系人姓名", trigger: "blur" },
        ],
        linkTel: [
          { required: true, message: "请输入手机号", trigger: "blur" },
          { validator: checkPhone, trigger: "blur" },
        ],
        companyProfile: [
          { required: true, message: "请输入企业简介", trigger: "blur" },
        ],
        industry: [
          { required: true, message: "请选择行业类别", trigger: "blur" },
        ],
        incorporationDate: [
          { required: true, message: "请选择成立日期", trigger: "change" },
        ],
        registeredCapital: [
          { required: true, message: "请输入注册资金", trigger: "blur" },
        ],
        natureBusiness: [
          { required: true, message: "请输入经营范围", trigger: "blur" },
        ],
        businessLicense: [
          { required: true, message: "请上传营业执照", trigger: "blur" },
        ],
      },

      traditionalCategory: [],
    };
  },
  created() {
    this.getEntBaseInfo();
    this.getTraditionalCategory();
  },
  methods: {
    /**
     * 获取行业类别
     */
    async getTraditionalCategory() {
      const { data } = await getDicts("traditional_categories");
      console.log("获取行业类别", data);
      this.traditionalCategory = data;
    },
    beforeUpload(file) {
      const isJpgOrPng =
        file.type === "image/jpeg" || file.type === "image/png";
      if (!isJpgOrPng) {
        this.$message.warning("请上传正确的文件格式");
        return false;
      }
      const isLt2M = file.size / 1024 / 1024 < 5;
      if (!isLt2M) {
        this.$message.warning("请上传5M以内的大小图片");
        return false;
      }
      return isJpgOrPng && isLt2M;
    },

    handleChange(info, type) {
      if (info.file.status === "uploading") {
        this.loading = true;
        return;
      }
      if (info.file.status === "done") {
        // Get this url from response in real world.
        if (type == 0) {
          this.form.logo = info.file.response.data.url;
          console.log("handleChange", info, type);
        } else {
          this.form.businessLicense = info.file.response.data.url;
          console.log("handleChange", info, type);
        }
      }
    },

    onSubmit() {
      console.log("this.form", this.form);
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          // thiseditCompanyInfo
          this.updateEntBaseInfo();
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    resetForm() {
      this.$refs.ruleForm.resetFields();
    },
    // 获取企业基本信息
    async getEntBaseInfo() {
      const companyId = JSON.parse(getCookiesUserInfo()).companyId;
      const res = await getCompaynInfo(companyId);
      if (res.code == 200) {
        for (let key in this.form) {
          this.form[key] = res.data[key];
        }
        this.EntInfo = res.data;
        console.log("获取企业基本信息", this.EntInfo);
      }

      // getEntBaseInfo()
      //     .then((res) => {
      //         if (res.code == 200) {
      //             for (let key in this.form) {
      //                 this.form[key] = res.data[key]
      //             }
      //             this.EntInfo = res.data;
      //             if (res.data.auditStatus == 1) {
      //                 this.$message.warning("信息正在审核中。");
      //             }
      //         }
      //     })
      //     .catch((error) => { });
    },
    // 编辑更新用户信息
    async updateEntBaseInfo() {
      this.IsDisable = true;

      console.log(this.form);
      editCompanyInfo(this.form)
        .then((res) => {
          this.IsDisable = false;
          if (res.code == 200) {
            this.$message.success("修改成功");
            setTimeout(() => {
              // this.$router.push("/usercenter/BaseInformation");
              this.$router.back();
            }, 500);
          } else {
            this.$message.warning("修改失败");
          }
        })
        .catch((error) => {
          this.IsDisable = false;
        });
    },

    clear() {
      // 清空表单
      this.form.resetFields();
    },
  },
};
</script>

<style lang="less" scoped>
.btn {
  width: 120px;
  height: 40px;
  border-radius: 4px;
}

.reviseInformation {
  padding: 21px 24px;
  background-color: #ffffff;
  border-radius: 4px;

  h2 {
    font-size: 22px;
    color: #303133;
    font-weight: 700;
    padding-bottom: 24px;
    border-bottom: solid 1px #e9e9e9;
  }

  .main {
    .img-box {
      width: 246px;
      height: 138px;
      background-color: #ffffff;
      border: solid 1px #dcdfe6;
      display: flex;
      justify-content: center;
      align-items: center;

      img {
        height: 138px;
        width: 246px;
        object-fit: cover;
      }
    }

    .uploadlogo {
      margin-top: 100px;
    }
  }
}

textarea {
  min-height: 100px !important;
}
</style>
